<template>
  <BasicLayout>
    <template #wrapper>
      <el-card v-loading="loading" class="box-card">
        <el-descriptions>
          <div v-show="info.name" slot="title">
            姓名：{{ info.name }}
          </div>
          <el-descriptions-item label="注册时间">{{ info.createdAt && parseTime(info.createdAt) }}</el-descriptions-item>
          <el-descriptions-item label="升本时间">{{ info.shen_ben_time && parseTime(info.shen_ben_time) }}</el-descriptions-item>
          <el-descriptions-item label="注册账号">{{ detailInfo.account }}</el-descriptions-item>
          <el-descriptions-item label="归属大区">{{ info.province_dept ? info.province_dept.dept_name : '' }}</el-descriptions-item>
          <el-descriptions-item label="所属区域">{{ info.city_dept ? info.city_dept.dept_name : '' }}</el-descriptions-item>
          <el-descriptions-item label="归属教学点">{{ info.area_dept ? info.area_dept.dept_name : '' }}</el-descriptions-item>
          <el-descriptions-item label="关联上级">{{ info.recommenders ? info.recommenders.name : '' }}</el-descriptions-item>
          <el-descriptions-item label="上级账号">{{ info.recommender }}</el-descriptions-item>
          <el-descriptions-item label="大区经理">{{ info.regional_managers ? info.regional_managers.user_name : '' }}</el-descriptions-item>
          <el-descriptions-item label="区域经理">{{ info.regional_manager ? info.regional_manager.user_name : '' }}</el-descriptions-item>
          <el-descriptions-item label="招生老师">{{ info.admissions_officer ? info.admissions_officer.user_name : '' }}</el-descriptions-item>
          <el-descriptions-item label="所属班级">{{ classInfo.name }}</el-descriptions-item>
          <el-descriptions-item label="学员类型">{{ info.user_type }}</el-descriptions-item>
          <el-descriptions-item label="学员来源">{{ info.source }}</el-descriptions-item>
          <el-descriptions-item label="学生标示">{{ info.user_label }}</el-descriptions-item>
        </el-descriptions>
      </el-card>

      <!-- <el-card class="box-card" header="提现进度">
        <el-steps :active="activeIndex">
          <el-step title="提交申请">
            <div slot="description">
              <div>{{ detailInfo.name }}</div>
              <div>{{ detailInfo.tx_time && parseTime(detailInfo.tx_time) }}</div>
            </div>
          </el-step>
          <el-step title="提现到账">
            <div slot="description">
              <div>{{ detailInfo.bank_name }}</div>
              <div>{{ detailInfo.bank_num }}</div>
            </div>
          </el-step>
          <el-step title="完成">
            <div slot="description">
            </div>
          </el-step>
        </el-steps>
      </el-card> -->
      <el-card class="box-card" header="用户提现记录">
        <el-table :data="dataList" border>
          <el-table-column type="index" header-align="center" label="序号" align="center" />
          <el-table-column label="提现金额" header-align="center" align="left" prop="tx_amount">
            <template slot-scope="scope">
              <span class="text-price">{{ $Prices(scope.row.tx_amount) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="账户余额" header-align="center" align="left" prop="account_balance">
            <template slot-scope="scope">
              <span class="text-price">{{ $Prices(scope.row.account_balance) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="提现时间" align="center" prop="createdAt">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.tx_time) }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="bank_name" align="center" label="提现银行" />
          <el-table-column prop="bank_num" align="center" label="提现账号">
            <template slot-scope="scope">
              <span>{{ $formateCardNumber(scope.row.bank_num) }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="tx_status" align="center" label="提现状态" />
        </el-table>
        <pagination
          v-show="total>0"
          :total="total"
          :page.sync="queryParams.pageIndex"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"
        />
      </el-card>
    </template>
  </BasicLayout>
</template>

<script>
import { mtxListForUser } from '@/api/admin/sys-finance'
export default {
  name: 'SysWithdrawalView',
  components: {},
  data() {
    return {
      dataList: [],
      activeIndex: 0,
      loading: true,
      info: {},
      detailInfo: {},
      classInfo: {},
      total: 0,
      queryParams: {
        pageIndex: 1,
        pageSize: 10,
        finance_txmx_id: undefined
      }
    }
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      mtxListForUser({
        ...this.queryParams,
        finance_txmx_id: this.$route.params.id * 1
      }).then(response => {
        this.info = response.data.list?.account_info ?? {}
        this.detailInfo = response.data.list?.finance_txmx_detail ?? {}
        this.classInfo = response.data.list?.class_info ?? {}
        if (this.detailInfo.bank_num) {
          this.detailInfo.bank_num = this.$formateCardNumber(this.detailInfo.bank_num)
        }
        this.activeIndex = this.detailInfo.bank_name ? 3 : 0
        this.dataList = response.data.list?.lists
        this.total = response.data.count
      }).finally(() => {
        this.loading = false
      })
    }
  }
}
</script>

